<template>
  <div class="site-wrapper" :class="{ 'site-sidebar--fold': sidebarFold }" v-loading.fullscreen.lock="loading"
    element-loading-text="拼命加载中">
    <template v-if="!loading && state == 0">
      <main-navbar @changeSidebarState='openRightSidebar=!openRightSidebar' />
      <main-sidebar />
      <div class="site-content__wrapper" :style="{ 'min-height': documentClientHeight + 'px' }">
        <keep-alive>
          <main-content ref="mainContent" @refresh='getRefresh' />
        </keep-alive>
      </div>
    </template>
    <template v-else-if="!loading && state == 2">
      <review-faliure></review-faliure>
    </template>
    <template v-else-if="!loading && state == 1">
      <reviewing></reviewing>
    </template>
  </div>
</template>

<script>
  import MainNavbar from './main-navbar'
  import MainSidebar from './main-sidebar'
  import MainContent from './main-content'
  import ReviewFaliure from './review-faliure'
  import Reviewing from './reviewing'
  export default {
    data() {
      return {
        // openRightSidebar: false,
        loading: true,
        state: ''
      }
    },
    components: {
      ReviewFaliure,
      Reviewing,
      MainNavbar,
      MainSidebar,
      MainContent
    },
    computed: {
      documentClientHeight: {
        get() {
          return this.$store.state.common.documentClientHeight
        },
        set(val) {
          this.$store.commit('common/updateDocumentClientHeight', val)
        }
      },
      sidebarFold: {
        get() {
          return this.$store.state.common.sidebarFold
        }
      },
      userId: {
        get() {
          return this.$store.state.user.id
        },
        set(val) {
          this.$store.commit('user/updateId', val)
        }
      },
      userName: {
        get() {
          return this.$store.state.user.name
        },
        set(val) {
          this.$store.commit('user/updateName', val)
        }
      },
      openRightSidebar: {
        get() {
          return this.$refs.mainContent.drawer
        },
        set(val) {
          this.$refs.mainContent.drawer = val
        }
      },
      shopId: {
        get() {
          return this.$store.state.shopId
        },
        set(val) {
          this.$store.commit('user/shopId', val)
        }
      },
      shopOpenTime: {
        get() {
          return this.$store.state.openTime
        },
        set(val) {
          this.$store.commit('user/shopOpenTime', val)
        }
      },
      shopStatus: {
        get() {
          return this.$store.state.user.shopStatus
        },
        set(val) {
          this.$store.commit('user/updateShopStatus', val)
        }
      },
    },
    // watch: {
    //   openRightSidebar(val){
    //     console.log(val);
    //     console.log(this.$refs);
    //     this.$refs.mainContent.drawer = val
    //   }
    // },
    created() {
      this.getUserInfo()
    },
    mounted() {
      this.resetDocumentClientHeight()
    },
    methods: {
      // 重置窗口可视高度
      resetDocumentClientHeight() {
        this.documentClientHeight = document.documentElement['clientHeight']
        window.onresize = () => {
          this.documentClientHeight = document.documentElement['clientHeight']
        }
      },
      // 获取当前管理员信息
      getUserInfo() {
        // console.log("running");
        this.$http({
          url: this.$http.adornUrl('/sys/user/info'),
          method: 'get',
          params: this.$http.adornParams()
        }).then(({
          data
        }) => {
          // console.log(data);
          this.shopId = data.shopId
          this.shopOpenTime = data.openTime
          this.shopStatus = data.shopStatus
          this.loading = false
          this.userId = data.userId
          this.userName = data.username
          this.state = data.state
        })
      },
      getShopInfo() {
        this.$http({
          url: this.$http.adornUrl('/shop/shopDetail/page'),
          method: 'get',
        }).then((res) => {
          console.log(res.data)
        })
      },
      changeState() {
        console.log("running");
      },
      getRefresh() {
        this.getUserInfo()
        this.resetDocumentClientHeight()
      },
    }
  }
</script>
